<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title>Prototype Unit test file</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <script src="../../ext/prototype.js" type="text/javascript"></script>
  <script src="../lib/unittest.js" type="text/javascript"></script>
  <script src="../../backend-debug.js?load=prototype,observable,configurable,validable" type="text/javascript"></script>
  <link rel="stylesheet" href="../test.css" type="text/css" />
</head>
<body>
<h1>Backend Unit test file</h1>
<p>
  Test of utility functions in validable.js
</p>

<!-- Log output -->
<div id="testlog"> </div>

<!-- Test DIV's -->
<form id="form" style="display: none;">
<input type="text" name="f1" value="" id="f1"/>
<input type="text" name="f2" value="" id="f2"/>
<input type="checkbox" name="f3" value="" id="f3"/>
<input type="radio" name="f4" id="f4_1" value=""/>
<input type="radio" name="f4" id="f4_2" value=""/>
<select name="f5" id="f5">
    <option value="1">1</option>
    <option value="2">1</option>
</select>
<select name="f6" multiple="yes" id="f6">
    <option value="1" id="op1">1</option>
    <option value="2">2</option>
    <option value="3" id="op2">3</option>
</select>
<textarea name="f7" id="f7">
</textarea>
</form>

<div id="f5_msg" style="display: none;">aaa</div>

<!-- Tests follow -->
<script type="text/javascript" language="javascript" charset="utf-8">
// <![CDATA[
  new Test.Unit.Runner({
    testAssign: function() {with(this) {
      Backend.Validable.setDefaults({test: 1});
      $('f1').validate('notnull');
      $('f1').validate('notblank');
      $('f2').validate('notnull', {errorClass: 'validation-shit'});
      assert($('f1').rules.keys().length == 2);
      assertNotNullOrUndefined($('f1').rules.get('notnull'));
      assertNotNullOrUndefined($('f1').rules.get('notblank'));
      assertNotNullOrUndefined($('f2').rules.get('notnull'));
      assert($('f2').rules.get('notnull').errorClass == 'validation-shit');
      assert($('f2').rules.get('notnull').test == 1);

    }},
    testNotNullNotBlank: function() {with(this) {
      $('f1').setValue('');
      assert(!$('f1').check());
      $('f1').setValue(' ');
      assert(!$('f1').check());
      $('f1').setValue('test');
      assert($('f1').check());
    }},
    testByNameCheck: function() {with(this) {
      $('f1').setValue(' ');
      assert($('f1').check('notnull'));
      assert(!$('f1').check('notblank'));
    }},
    testIsChecked: function() {with(this) {
      $('f3').checked = false;
      $('f3').validate('checked');
      assert(!$('f3').check());
      $('f3').checked = true;
      assert($('f3').check());
    }},
    testNotNullRadio: function() {with(this) {
      $('f4_1').checked = false;
      $('f4_2').checked = false;
      $('f4_1').validate('notnull')
      assert(!$('f4_1').check());

      $('f4_1').checked = false;
      $('f4_2').checked = true;
      $('f4_1').validate('notnull')
      assert($('f4_1').check());
    }},
    testNotNullMultiselect: function() {with(this) {
      $('op1').selected = false;
      $('op2').selected = false;
      $('f6').validate('notnull');
      assert(!$('f6').check());

      $('op1').selected = true;
      assert($('f6').check());
    }},
    testShowMessage: function() {with(this) {
      $('f5').showMessage('notnull');
      assert(!$('f5').hasClassName('validation-error'));
      $('f5').validate('notnull', {message: 'f5_msg'});
      $('f5').showMessage('notnull');
      assert($('f5').hasClassName('validation-error'));
      assertVisible($('f5_msg'));
    
    }},
    testHideMessage: function() {with(this) {
      $('f5').hideMessage('notnull');
      assert(!$('f5').hasClassName('validation-error'));
      assertNotVisible($('f5_msg'));
    }}
  });
// ]]>
</script>
</body>
</html>